import { message } from "@/utils/message";
import { getApplicationListPage, getApplicationNameList} from "@/api/system";
import { transformI18n } from "@/plugins/i18n";
import {reactive, ref, toRaw, onBeforeMount} from "vue";
import type { PaginationProps } from "@pureadmin/table";
import { useRoute, useRouter } from "vue-router";

export function useApplication() {
  const route = useRoute();
  const router = useRouter();
  const applicationgOption = ref([{}]);
  let formVisible = ref(false)
  let eidtformRef = ref(null)
  let applicationAddRef = ref(null);
  let appStartApplyRef = ref(null);
  let appCancelApplyRef = ref(null);
  let editform = ref({
    applicationId: "",
    title: "",
    status: '',
    applicationCode: "",
    applicationName: '',
    applicationDescription: "",
    developmentTeam: '',
    versionNumber: "",
    createTime: '',
    updateTime: "",
    createBy: '',
    updateBy: "",
  })
  const form = reactive({
    applicationId: "",
    title: "",
    status: '',
    applicationCode: "",
    applicationName: '',
    applicationDescription: "",
    developmentTeam: '',
    versionNumber: "",
    createTime: '',
    updateTime: "",
    createBy: '',
    updateBy: "",
    currentPage: "1",
    pageSize: "10",
    statusName: "",
  });

  const formRef = ref();
  const dataList = ref([{}]);
  const loading = ref(true);
  const pagination = reactive<PaginationProps>({
    total: 0,
    pageSize: 10,
    currentPage: 1,
    background: true
  });

  const columns: TableColumnList = [
    {
      label: "应用编码",
      prop: "applicationCode",
    },
    {
      label: "应用名称",
      prop: "applicationName",
    },
    {
      label: "应用描述",
      prop: "applicationDescription",
    },
    {
      label: "开发团队",
      prop: "developmentTeam",
    },
    {
      label: "应用状态名称",
      prop: "statusName",
    },
    {
      label: "应用版本号",
      prop: "versionNumber",
    },
    {
      label: "应用创建时间",
      prop: "createTime",
    },
    {
      label: "应用最后更新时间",
      prop: "updateTime",
    },
    {
      label: "创建人",
      prop: "createBy",
    },
    {
      label: "更新人",
      prop: "updateBy",
    },
    {
      label: "操作",
      fixed: "right",
      width: 210,
      slot: "operation"
    }
  ];
  function onChange() {
  }
  function handleSelectionChange(val) {
  }
  function handleSizeChange(val: number) {
    form.pageSize = val.toString()
    onSearch()
  }

  function handleCurrentChange(val: number) {
    form.currentPage = val.toString()
    onSearch()
  }

  function resetForm(formEl) {
    if (!formEl) return;
    console.log(formEl)
    formEl.resetFields();
    onSearch();
  }
  async function onSearch() {
    await getApplicationListPage(toRaw(form)).then((res: any) => {
      if(res.code == 200){
        console.log(res)
        res.data.rows.forEach((item) => {
          item.statusName = item.status == 1 ? "已启用" : "已注销"
        })
        dataList.value = res.data.rows
        pagination.total = res.data.total;
        pagination.pageSize = res.data.pageSize;
        pagination.currentPage = res.data.currentPage
      }
    })
    applicationNameList();
    setTimeout(() => {
      loading.value = false;
    }, 500);
  }

  function openDialog(row) {
    applicationAddRef.value.dialogTree = true;
    applicationAddRef.value.fillForm(row)
  }
  const closeDialog = () => {
    formVisible.value = false
  }

  function applicationAdd() {
    let row = reactive({
      applicationId: "",
      applicationCode: "",
      applicationName: '',
      applicationDescription: "",
      developmentTeam: '',
      versionNumber: "1.0",
    });
    applicationAddRef.value.fillForm(row)
    applicationAddRef.value.dialogTree = true;
  }

  function applicationStart(row) {
    appStartApplyRef.value.dialogTree = true;
    appStartApplyRef.value.fillForm(row)

  }

  function applicationCancel(row) {
    appCancelApplyRef.value.dialogTree = true;
    appCancelApplyRef.value.fillForm(row)
  }

  function handleDelete(row) {
    message(`您删除了菜单名称为${transformI18n(row.title)}的这条数据`, {
      type: "success"
    });
    onSearch();
  }

  async function applicationNameList() {
    const { data } = await getApplicationNameList();
    applicationgOption.value = data;
  }

  onBeforeMount(() => {
    onSearch();
  });



  return {
    pagination,
    eidtformRef,
    applicationAddRef,
    appStartApplyRef,
    appCancelApplyRef,
    editform,
    closeDialog,
    formVisible,
    form,
    loading,
    columns,
    dataList,
    onChange,
    /** 搜索 */
    onSearch,
    /** 重置 */
    resetForm,
    /** 新增、修改菜单 */
    openDialog,
    applicationAdd,
    /** 删除菜单 */
    handleDelete,
    handleSelectionChange,
    handleSizeChange,
    handleCurrentChange,
    /** 申请 */
    applicationStart,
    applicationCancel,
    applicationgOption
  };
}
